<template>
	<div class="setting-user">
		<div class="setting-card">
			<div class="setting-item-title">缓存清理</div>
			<div class="setting-item-content">
				<div class="item">
					<el-checkbox v-model="form.cate">分类缓存</el-checkbox>
				</div>
				<div class="item">
					<el-checkbox v-model="form.item">文章缓存</el-checkbox>
				</div>
				<div class="item">
					<el-checkbox v-model="form.comment">评论缓存</el-checkbox>
				</div>
				<div class="item">
					<el-checkbox v-model="form.show">显示缓存</el-checkbox>
				</div>
				<div class="item">
					<el-checkbox v-model="form.user">用户缓存</el-checkbox>
				</div>
				<div class="item">
					<el-checkbox v-model="form.resume">简历缓存</el-checkbox>
				</div>
			</div>
		</div>
		<div class="setting-card">
			<div class="setting-item-title">生成缓存</div>
			<div class="setting-item-content">
		    	<el-button type="primary" :loading="cacheLoading" @click="creatCache">生成所有缓存</el-button>
			</div>
		</div>
		<sub-foot :prompt="prompt" :loading="loading" @saveChange="save"></sub-foot>
	</div>
</template>

<script>
	import SubFoot from 'components/setting/sub-foot'

	export default {
		data() {
			return {
				prompt: '这些将处理系统缓存数据',
				form: {
					cate: false,
					item: false,
					comment: false,
					show: false,
					resume: false,
					user: false
				},
				loading: false,
				cacheLoading: false
			}
		},
		methods: {
			creatCache() {
				this.cacheLoading = true
				this.$http.get('/clearCache').then((response) => {
					this.$notify({
			          title: '缓存生成操作成功',
			          message: '缓存已被清除 将在下次访问时重新生成',
			          type: 'success'
			        });
					this.cacheLoading = false
				})
			},
			save() {
				this.loading = true
			}
		},
		components: {
			SubFoot
		}
	}
</script>

<style scope>
@import '../../../static/css/simplemk.css'
</style>